import { defineConfig, loadEnv, ConfigEnv, UserConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from "path"
import AutoImport from "unplugin-auto-import/vite";
import Components from "unplugin-vue-components/vite";
import { ElementPlusResolver } from "unplugin-vue-components/resolvers";
import Icons from "unplugin-icons/vite";
import IconsResolver from "unplugin-icons/resolver";
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
import UnoCSS from 'unocss/vite'
import postcsspxtoviewport from "postcss-px-to-viewport"
import glsl from 'vite-plugin-glsl';
import { VueMcp } from'vite-plugin-vue-mcp'
import removeConsole from "vite-plugin-remove-console";
const pathSrc = path.resolve(__dirname, "src")
export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
  return {
    resolve: {
      alias: {
        "@": pathSrc
      }
    },
    css: {
      preprocessorOptions: {
        scss: {
          javascriptEnabled: true,
          additionalData: `@use "@/styles/variables.scss" as *;`
        }
      },
      postcss: {
        plugins: [
          postcsspxtoviewport({
            viewportWidth: 1920,
            unitToConvert: 'px',
            unitPrecision: 5,
            propList: ['*'],
            viewportUnit: 'rem',
            fontViewportUnit: 'rem',
            selectorBlackList: [],
            minPixelValue: 1,
            mediaQuery: false,
            replace: true,
            exclude: undefined,
            include: undefined,
            landscape: false,
            landscapeUnit: 'rem',
            landscapeWidth: undefined
          }),     
        ]
      },
    },
    plugins: [
      VueMcp({
        host:"localhost",
        port:5175,
        printUrls:true
      }),
      glsl(),
      vue(),
      removeConsole(),
      AutoImport({
        imports: ["vue"],
        eslintrc: {
          enabled: true,
          filepath: "./.eslintrc-auto-import.json",
        },
        dts: path.resolve(pathSrc, "types", "auto-imports.d.ts"),
      }),
      Components({
        resolvers: [
          ElementPlusResolver(),
          IconsResolver({
            enabledCollections: ["ep"]
          }),
        ],
        dts: path.resolve(pathSrc, "types", "components.d.ts"),
      }),
      Icons({
        autoInstall: true,
      }),
      createSvgIconsPlugin({
        iconDirs: [path.resolve(process.cwd(), 'src/assets/icons')],
        symbolId: 'icon-[dir]-[name]',
      }),
      UnoCSS({  }),
    ],
    base: "./",
    server: {
      host: "0.0.0.0",
      open: true,
      port: 5175,
      proxy: {
        '/api': {
          target: "http://192.168.5.74:3001",
          changeOrigin: true,
          rewrite: (path) => path.replace(/^\/api/, '')
        },
      },
    }
  }
})

